﻿<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>浙江省安全生产监控中心服务平台</title>
	<meta name="description" content="安全监控">
	<meta name="keywords" content="table">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="renderer" content="webkit">
	<meta http-equiv="Cache-Control" content="no-siteapp" />
	<meta name="apple-mobile-web-app-title" content="Amaze UI" />
	
	<link rel="icon" type="image/png" href="../assets/i/favicon.png">
	<link rel="apple-touch-icon-precomposed" href="../assets/i/app-icon72x72@2x.png">
	
	<link rel="stylesheet" href="../assets/css/amazeui.min.css"/>
	<link rel="stylesheet" href="../assets/css/admin.css">

	<link rel="stylesheet" href="../mstp_115_enonadmin/assets/css/bootstrap.css">
	<link rel="stylesheet" href="../mstp_115_enonadmin/assets/css/xenon-core.css"> 
	<link rel="stylesheet" href="../mstp_115_enonadmin/assets/css/custom.css">
	<link rel="stylesheet" href="../mstp_115_enonadmin/assets/css/fonts/fontawesome/css/font-awesome.min.css">
	 
	<script src="../assets/js/jquery.min.js"></script>
	<!-- <script src="../mstp_115_enonadmin/assets/js/jquery-1.11.1.min.js"></script> -->
	<!-- <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> -->
	<!-- <script src="http://cdn.staticfile.org/jquery/2.2.1/jquery.min.js"></script> -->
	<!-- <script src="http://lib.sinaapp.com/?path=jquery/3.1.0/jquery-3.1.0.min.js"></script> -->
	<script src="../assets/js/amazeui.min.js"></script>
	<script src="../assets/js/app.js"></script>

	<!-- <script src="http://lib.sinaapp.com/?path=bootstrap/3.0.0/js/bootstrap.min.js"></script> -->
	<script src="../mstp_115_enonadmin/assets/js/bootstrap.min.js"></script>
	<script src="../mstp_115_enonadmin/assets/js/xenon-toggles.js"></script>
	<script src="../mstp_115_enonadmin/assets/js/xenon-custom.js"></script>
	<script src="../mstp_115_enonadmin/assets/js/resizeable.js"></script>
	
	<!-- <script src="../mstp_115_enonadmin/assets/js/TweenMax.min.js"></script> -->
	<!-- <script src="../mstp_115_enonadmin/assets/js/joinable.js"></script> -->
	<!-- <script src="../mstp_115_enonadmin/assets/js/xenon-api.js"></script> -->
	
	<!--=============Strat---百度地图相关静态资源=================-->
	<!--1.加载百度地图JS-->
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=F3643ae048b499a5992aa0db0106b235"></script>
	<!--加载鼠标绘制工具-->
	<script type="text/javascript" src="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.js"></script>
	<link rel="stylesheet" href="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.css" />
	<!-- 加载百度地图样式信息窗口 -->
	<script type="text/javascript" src="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.js"></script>
	<link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.5/src/SearchInfoWindow_min.css" />
	<!--=============End---百度地图相关静态资源=================-->
	
	<style>
		.admin-content{
			background:#ffffff;
		}
		.am-divider{
			margin:0.5rem;
		}
		#allmap {height: 490px;overflow: hidden;margin:0;font-family:"微软雅黑";}
		#chat > div  {
			background: #ffffff none repeat scroll 0 0;
		}
		label{
			max-width:none;
		}
		#pageShow div , #page-jump{
			display:inline;
		}
		#page-jump{
			width:40px;
			height:30px;
		}
		#pageShow{
			padding:0;
		}
		.total-page{
			padding:0px 4px;
			vertical-align: middle;
		}
	</style>
</head>
<body>
<!--[if lte IE 9]>
<p class="browsehappy">你正在使用<strong>过时</strong>的浏览器，本系统平台暂不支持。 请升级浏览器以获得更好的体验！</p>
<![endif]-->

	<header class="am-topbar admin-header">
	  <div class="am-topbar-brand">
		<strong>安全生产监控中心服务平台</strong> <small>Safety Monitoring Center Service Platform</small>
	  </div>

	  <button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-success am-show-sm-only" data-am-collapse="{target: '#topbar-collapse'}"><span class="am-sr-only">导航切换</span> <span class="am-icon-bars"></span></button>

	  <div class="am-collapse am-topbar-collapse" id="topbar-collapse">

		<ul class="am-nav am-nav-pills am-topbar-nav am-topbar-right admin-header-list">
			<li>
				<a href="#" data-toggle="chat">
					<span class="am-icon-envelope-o"></span> 企业列表 
					<span class="am-badge am-badge-warning" id="entNum"></span>
				</a>
			</li>
			<li>
				<a href="#siderbar_right" data-am-offcanvas>
					<span class="am-icon-envelope-o"></span> 侧边栏 
				</a>
			</li>
			
			<li class="am-dropdown" data-am-dropdown>
				<a class="am-dropdown-toggle" data-am-dropdown-toggle href="javascript:;">
					<span class="am-icon-users"></span> 管理员 
					<span class="am-icon-caret-down"></span>
				</a>
				<ul class="am-dropdown-content">
					<li><a href="#"><span class="am-icon-user"></span> 资料</a></li>
					<li><a href="#"><span class="am-icon-cog"></span> 设置</a></li>
					<li><a href="#"><span class="am-icon-power-off"></span> 退出</a></li>
				</ul>
			</li>
		  <li class="am-hide-sm-only"><a href="javascript:;" id="admin-fullscreen"><span class="am-icon-arrows-alt"></span> <span class="admin-fullText">开启全屏</span></a></li>
		</ul>
	  </div>
		<!--===================侧边栏START===============-->
		<div id="siderbar_right" class="am-offcanvas">
			<div class="am-offcanvas-bar">
				<div class="am-offcanvas-content">
					<p>
						你那张略带着 <br/>
						一点点颓废的脸孔 <br/>
						轻薄的嘴唇 <br/>
						含着一千个谎言
					</p>
				</div>
			</div>
		</div>
		<!--===================侧边栏END===============-->
	
	</header>

	<div class="am-cf admin-main">
		<div class="page-container">
					<!--===============start: Chat Section============== -->
					<div id="chat" class="fixed">
						<div class="chat-inner">
							<h2 class="chat-header">
								<a href="#" class="chat-close" data-toggle="chat">
									<i class="fa-plus-circle rotate-45deg"></i>
								</a>
								<span class="badge badge-success is-hidden">0</span>
								企业列表<small>/Enterprise</small>
							</h2>
							<hr>
							<!--返回的企业数据列表-->
							<div class="chat-group baiduMap-pois"></div>
							<!--分页导航条-->
							<div>
								<ul class="pagination" id="json-list">
									<li id='firstPage'><a href="#"><i class="fa-angle-left"></i><i class="fa-angle-left"></i></a></li>
									<li id='prev'><a href="#"><i class="fa-angle-left"></i></a></li>
									<li><span id="pageShow"><input type="text" class="form-control current-page" id="page-jump" placeholder="页码" /><div class='total-page'></div></span></li>
									<li id='next'><a href="#"><i class="fa-angle-right"></i></a></li>
									<li id='lastPage'><a href="#"><i class="fa-angle-right"></i><i class="fa-angle-right"></i></a></li>
								</ul>
							</div>
						</div>
					</div>
					<!-- ==============end: Chat Section ==================-->
		</div>
		
		<!-- content start -->
        <div class="admin-content ">
    
			<div class="am-cf am-padding">
				<div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">安全监控大数据</strong> / <small>Information</small></div>
			</div>
			<hr data-am-widget="divider" style="" class="am-divider am-divider-default" />
		
			<div class="am-g">
				<div class="row ">
					<div class="col-md-12 ">
						<!--地图容器-->
						<div id="allmap"></div>
						<div id="result">
							<input type="button" value="获取绘制的覆盖物个数" onclick="alert(overlays.length)"/>
							<input type="button" value="清除所有覆盖物" onclick="clearAll()"/>
							<input type="button" value="开启编辑" onclick = "enableEdit();"/>
							<input type="button" value="结束编辑" onclick = "disableEdit();"/>
							<input type="button" value="打印对象地理信息" onclick = "getGeoInfo();"/>
							<input id="open" type="button" value="危化图层"/>
							<input type="button" value="企业平面图" onclick = "addMapOverlay();"/>
						</div>
					</div>
					
				</div>
			</div>
		</div>
		<!-- content end -->
	</div>

<a href="#" class="am-icon-btn am-icon-th-list am-show-sm-only admin-menu" data-am-offcanvas="{target: '#admin-offcanvas'}"></a>

<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="../assets/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

<!--[if (gte IE 9)|!(IE)]><!-->


<!--百度地图API功能-->
<script>
	//================Start==infoWin====================
	var html = [];
	html.push('<span style="font-size:12px">属性信息: </span><br/>');
	html.push('<table border="0" cellpadding="1" cellspacing="1" >');
	html.push('  <tr>'); 
	html.push('      <td align="left" class="common">企业名称：</td>');
	html.push('      <td colspan="2"><input type="text" maxlength="50" size="18"  id="txtName"></td>');
	html.push('	     <td valign="top"><span class="star">*</span></td>');
	html.push('  </tr>');
	html.push('  <tr>');
	html.push('      <td  align="left" class="common">联系电话：</td>');
	html.push('      <td colspan="2"><input type="text" maxlength="30" size="18"  id="txtTel"></td>');
	html.push('	   <td valign="top"><span class="star">*</span></td>');
	html.push('  </tr>');
	html.push('  <tr>');
	html.push('      <td  align="left" class="common">地址：</td>');
	html.push('      <td  colspan="2"><input type="text" maxlength="50" size="18"  id="txtAddr"></td>');
	html.push('	   <td valign="top"><span class="star">*</span></td>');
	html.push('  </tr>');
	html.push('  <tr>');
	html.push('      <td align="left" class="common">描述：</td>');
	html.push('      <td colspan="2"><textarea rows="2" cols="15"  id="areaDesc"></textarea></td>');
	html.push('	   <td valign="top"></td>');
	html.push('  </tr>');
	html.push('  <tr>');
	html.push('	     <td  align="center" colspan="3">');
	html.push('        <input type="button" name="btnOK"  onclick="fnOK()" value="确定">&nbsp;&nbsp;');
	html.push('		     <input type="button" name="btnClear" onclick="fnClear();" value="重填">');
	html.push('	     </td>');
	html.push('  </tr>');
	html.push('</table>');
	/*
	html.push('<div class="xe-widget xe-todo-list xe-todo-list-turquoise">');
	html.push('    <div class="xe-header"><div class="xe-icon"><i class="fa-file-text-o"></i></div><div class="xe-label"><span>to do list</span><strong>Tasks</strong></div></div>');
	html.push('    <div class="xe-body"><ul class="list-unstyled">');
	html.push('        <li class="done">');
	html.push('            <label>');
	html.push('                <input type="checkbox" class="cbr cbr-turquoise" checked />');
	html.push('                <span>Web Design</span>');
	html.push('            </label>');
	html.push('        </li>');
	html.push('        <li class="done">');
	html.push('            <label>');
	html.push('                <span>地址</span>');
	html.push('                <input type="text" class="form-control" placeholder="Address" />');
	html.push('            </label>');
	html.push('        </li>');
	html.push('    </div>');
	html.push('<div>');
	*/
	
	var curMkr = null; // 记录当前添加的Mkr
	var infoWin = new BMap.InfoWindow(html.join(""), {offset: new BMap.Size(0, -10)});
	//================End==infoWin====================
	
	var map;
	var customLayer;//自定义图层
	var toggleFlag = 0;//切换事件标志,默认为0
	//图层
	var eventObjs = [];//绘图完成后的返回事件对象数组
	var overlays = [];//图层数组,含有
	
	//创建和初始化地图函数：
    function initMap(){
      createMap();//创建地图
      setMapEvent();//设置地图事件
	  //addMapOverlay();//向地图添加覆盖物
      addMapControl();//向地图添加控件
	  addDrawingTool();//添加绘图工具条
	  toggleE();//向id="open"的dom元素添加click切换显示/隐藏危化品企业图层
    }
    function createMap(){
      map = new BMap.Map("allmap"); 
      map.centerAndZoom("杭州", 11);
	  map.setCurrentCity("杭州");
    }
    function setMapEvent(){
      map.enableScrollWheelZoom();
      map.enableKeyboard();
      map.enableDragging();
      map.enableDoubleClickZoom();
    }
    function addClickHandler(target,window){
		target.addEventListener("click",function(){
			target.openInfoWindow(window);
		});
    }
    function addMapOverlay(){
		//修改地图样式
		map.setMapStyle({
			styleJson:[
				{
					"featureType":"all",
					"elementType":"all",
					"stylers":{
						"lightness":61,
						"saturation":-100
					}
				}
			]
		});
		//解析企业对象的json文件,在百度地图上生成专题图层
		var hhymPoint = new BMap.Point(120.346147,30.281946);
		map.centerAndZoom(hhymPoint, 18);
		var polyObj =new Array(); 
		$.getJSON("json/hhym.json" , function(data){
			var geoArray;
			var geoStyle;//polygon对象样式
			var geoProps;//每一组地理坐标系的对应属性信息
			var pointArray;//点对象数组
			var lonlat;//点坐标对象
			var polygon;
			for(var m = 0 ; m<data.features.length; m++){
				//获得json文件中coordinates属性值,是一个地理坐标二维数组,有多个多边形对像
				geoArray = data.features[m].geometry.coordinates;
				//必须把对象表达式扩起来eval执行才能生成一个匿名对象!
				geoStyle = eval("("+data.features[m].geometry.style+")");
				geoProps = data.features[m].geometry.properties;
				//第1层循环遍历多边形对象
				for(var i = 0 ; i<geoArray.length ; i++){
					var itemStyle;
					pointArray = geoArray[i];
					polyObj[i] = [];//定义二维数组,将一维数组中的每个对象再次定义为数组
					if("undefined" != typeof geoProps[i].lonlat){
						//geoProps[i].lonlat;
						var centerPoint = new BMap.Point(geoProps[i].lonlat[0],geoProps[i].lonlat[1]);
						var opts = {
							position : centerPoint,    // 指定文本标注所在的地理位置
							//offset   : new BMap.Size(30, -30)    //设置文本偏移量
						};
						var label = new BMap.Label(geoProps[i].name, opts);  // 创建文本标注对象
						label.setStyle(eval("("+geoProps[i].labelStyle+")"));
						map.addOverlay(label); 
						var labelName = geoProps[i].name;
						$("label:contains('"+labelName+"')").prepend($("<i class='fa-bullseye'></i>"));
					}
					//第2层循环遍历组成每个多边形对象的点信息
					for(var j = 0 ; j<pointArray.length ; j++){
						lonlat = pointArray[j];
						polyObj[i][j] = new BMap.Point(lonlat[0],lonlat[1]);
					}
					//判断每个地理区块是否有相应的样式类型itemStyle属性,若无则赋值该类feature统一的style属性
					if("undefined" != typeof geoProps[i].itemStyle){
						itemStyle = eval("("+geoProps[i].itemStyle.normal+")");
					}else{
						itemStyle = geoStyle;
					}
					//创建多边形
					polygon = new BMap.Polygon(polyObj[i] , itemStyle);
					//地图上加载多边形图层
					map.addOverlay(polygon);
					//加入覆盖物图层数组,可以实现开启编辑等功能
					overlays.push(polygon);
					//给多边形添加鼠标悬浮事件
					itemStyleToggle(polygon,m);
				}
			}
		});
    }
	/*
		@fn: itemStyleToggle:地图样式切换
		@params:
			polygon: 多边形对象
			featureIndex: 地理要素索引,对应于json文件中的feature顺序
	
	*/
	function itemStyleToggle(polygon, featureIndex){
		//第0个feature为厂区底图,不用添加样式切换事件
		if(featureIndex!=0){
			var normalColor = polygon.getFillColor();
			polygon.addEventListener("mouseover" , function(event)
			{
				event.target.setFillColor("rgb(0, 136, 186)");
			});
			polygon.addEventListener("mouseout" , function(event)
			{
				event.target.setFillColor(normalColor);
			});
		}
	}

	//===========start===向地图添加控件==========
    function addMapControl(){
		var size = new BMap.Size(60, 20);
		var scaleControl = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
		map.addControl(scaleControl);
		var navControl = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
		map.addControl(navControl);
		var overviewControl = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:false});
		map.addControl(overviewControl);
		var cityControl = new BMap.CityListControl({
			anchor: BMAP_ANCHOR_TOP_LEFT,
			offset: size
		});
		map.addControl(cityControl);
		map.addControl(new BMap.MapTypeControl());//添加地图类型(卫星/三维)控件
    }
    //===========end===向地图添加控件==========
	
	//=============START==鼠标绘制功能============
	function addDrawingTool(){
		//1.新建图层数组回调函数
		var overlaycomplete = function(e){//回调函数
			eventObjs.push(e);
			overlays.push(e.overlay);
			//点对象属性自定义信息窗口
			if("marker"==e.drawingMode){
				var mkr = e.overlay;
				mkr.openInfoWindow(infoWin);
				curMkr = mkr;
			}
		};
		//2.定义绘制工具样式
		var styleOptions = {
			strokeColor:"red",    //边线颜色。
			fillColor:"red",      //填充颜色。当参数为空时，圆形将没有填充效果。
			strokeWeight: 2,       //边线的宽度，以像素为单位。
			strokeOpacity: 0.8,	   //边线透明度，取值范围0 - 1。
			fillOpacity: 0.4,      //填充的透明度，取值范围0 - 1。
			strokeStyle: 'solid' //边线的样式，solid或dashed。
		}
		//3.实例化鼠标绘制工具
		var drawingManager = new BMapLib.DrawingManager(map, {
			isOpen: false, //是否开启绘制模式
			enableDrawingTool: true, //是否显示工具栏
			drawingToolOptions: {
				anchor: BMAP_ANCHOR_BOTTOM_RIGHT, //位置
				offset: new BMap.Size(5, 5), //偏离值
			},
			circleOptions: styleOptions, //圆的样式
			polylineOptions: styleOptions, //线的样式
			polygonOptions: styleOptions, //多边形的样式
			rectangleOptions: styleOptions //矩形的样式
		}); 
		//4.添加鼠标绘制工具监听事件,用于获取绘制结果,将获取到的覆盖物对象加入数组
		drawingManager.addEventListener('overlaycomplete', overlaycomplete);
	}
		
	//5.清除所有覆盖物,onclick事件调用
	function clearAll() {
		map.clearOverlays();//清除map对象中的所有overlay
		/*for(var i = 0; i < overlays.length; i++){
			map.removeOverlay(overlays[i]);
		}*/
		//以下两种方式均为清空数组,后者效率更高更彻底
		overlays.length = 0;
		eventObjs = [];
	}
	//6.设置覆盖物对象可编辑
	function enableEdit(){
		for(var i = 0; i < overlays.length; i++){
			overlays[i].enableEditing();
		}
	}
	//7.设置覆盖物对象不可编辑
	function disableEdit(){
		for(var i = 0; i < overlays.length; i++){
			overlays[i].disableEditing();
		}
	}
	//8.遍历覆盖物地理信息
	function getGeoInfo(){
		var pointArray = [];
		//以eventObjs进行遍历,overlays不行,因为有不同类型的覆盖物都放入该图层数组
		for(var i = 0; i < eventObjs.length; i++){
			if("polygon"==eventObjs[i].drawingMode){
				var pointArray = eventObjs[i].overlay.getPath();
				var pointJson = "";
				for(var j = 0; j < pointArray.length; j++){
					if(j == pointArray.length-1){
						pointJson +="[" + pointArray[j].lng +","+ pointArray[j].lat + "]";
					}else{
						pointJson +="[" + pointArray[j].lng + ","+ pointArray[j].lat + "],";
					}
				}
				alert(pointJson);
			}else if("marker"==eventObjs[i].drawingMode){
				var point = eventObjs[i].overlay.getPosition();
				//var point = overlays[i].getPosition();
				var pointJson = "[" + point.lng +","+ point.lat + "]";
				pointArray.push(pointJson);
			}
		}
		alert("标注的点对象地理坐标：" + pointArray);
	}
	//=============END==鼠标绘制功能==============

	
	//==========start==自定义格式点标注功能============
	//打开样式面板
	function openStylePnl(){
		document.getElementById("divStyle").style.display = "block";
	}
	//选择样式
	function selectStyle(index){
		mkrTool.open(); //打开工具 
		var icon = BMapLib.MarkerTool.SYS_ICONS[index]; //设置工具样式，使用系统提供的样式BMapLib.MarkerTool.SYS_ICONS[0] -- BMapLib.MarkerTool.SYS_ICONS[23]
		mkrTool.setIcon(icon); 
		document.getElementById("divStyle").style.display = "none";    
	}

	//提交数据
	function fnOK(){
		var name = encodeHTML(document.getElementById("txtName").value);
		var tel = encodeHTML(document.getElementById("txtTel").value);
		var addr = encodeHTML(document.getElementById("txtAddr").value);
		var desc = encodeHTML(document.getElementById("areaDesc").value);

		if(!name){
			alert("企业名称必须填写");    
			return;
		}
		if(curMkr){
			//设置label
			var lbl = new BMap.Label(name, {offset: new BMap.Size(4, 4)});
			lbl.setStyle({border: "solid 1px gray"});
			curMkr.setLabel(lbl);
			
			//设置title
			//var title = "电话: " + tel + "\n\r" + "地址: " +addr + "\n\r" + "描述: " + desc;
			curMkr.setTitle(name);        
		}
		if(infoWin.isOpen()){
			map.closeInfoWindow();
		}
		//在此用户可将数据提交到后台数据库中
		$.post("http://api.map.baidu.com/geodata/v3/poi/create", 
			{
				ak : "F3643ae048b499a5992aa0db0106b235",
				geotable_id : "158365",
				latitude:curMkr.getPosition().lat,
				longitude:curMkr.getPosition().lng,
				coord_type:1,
				title:curMkr.getTitle(),
				address:addr,
				tags:desc
			}
		);
	}

	//输入校验
	function encodeHTML(a){
		return a.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
	}

	//重填数据
	function fnClear(){
		document.getElementById("txtName").value = "";
		document.getElementById("txtTel").value = "";
		document.getElementById("txtAddr").value = "";
		document.getElementById("areaDesc").value = "";
	}
	//==========end==自定义格式点标注功能============
	
	//=============START==加载自定义图层============
	function addCustomLayer(tableId) {
		if (customLayer) {
			map.removeTileLayer(customLayer);
		}
		customLayer=new BMap.CustomLayer({
			geotableId: tableId,
			q: '', //检索关键字
			tags: '', //空格分隔的多字符串
			filter: '' //过滤条件,参考http://developer.baidu.com/map/lbs-geosearch.htm#.search.nearby
		});
		map.addTileLayer(customLayer);
		customLayer.addEventListener('hotspotclick',callback);//添加热点点击事件,调用callback()函数
	}
	//回调函数,单击热点图层
	function callback(e){
		var customPoi = e.customPoi;//poi的默认字段
		var contentPoi=e.content;//poi的自定义字段
		var content = '<p style="width:280px;margin:0;line-height:20px;">地址：' + customPoi.address + '<br/>危化品:'+contentPoi.chemicals+'</p>';
		var searchInfoWindow = new BMapLib.SearchInfoWindow(map, content, {
			title: customPoi.title, //标题
			width: 290, //宽度
			height: 40, //高度
			panel : "panel", //检索结果面板
			enableAutoPan : true, //自动平移
			enableSendToPhone: true, //是否显示发送到手机按钮
			searchTypes :[
				BMAPLIB_TAB_SEARCH//,   //周边检索
				//BMAPLIB_TAB_TO_HERE,  //到这里去
				//BMAPLIB_TAB_FROM_HERE //从这里出发 一二三六立日十口儿音章早古克兄叶
			]
		});
		var point = new BMap.Point(customPoi.point.lng, customPoi.point.lat);
		searchInfoWindow.open(point);
	}
	//删除自定义图层
	function removeCustomLayer(){
		if (customLayer) {
			map.removeTileLayer(customLayer);
		}
	}
	//切换添加、删除图层
	function toggleE(){
		$("#open").click(function(){
			if(toggleFlag == 0){
				addCustomLayer("48047");
				toggleFlag = 1;
			}else{
				removeCustomLayer();
				toggleFlag = 0;
			}
		});
	}
	//=============END==加载自定义图层============
		
	//=======START==ajax异步请求百度云数据平台的企业poi信息====
	/*
	getEnterpriseList:获取企业信息列表
		tableId:数据表编号
		callback:ajax回调函数
		pageIndex:分页索引，当前页码
	*/
	function getEnterpriseList(tableId,callback,pn){
		var initFlag = 0;//是否为初始化标识,是:1,否:0
		if("undefined" == typeof pn){
			pn=1;
			initFlag=1;
		}
		$.get("http://api.map.baidu.com/geodata/v3/poi/list",
			{
				ak : "F3643ae048b499a5992aa0db0106b235",
				geotable_id : tableId,
				page_index : pn-1
			},
			callback,
			"jsonp"//处理跨域请求
		);
	};
		//----回调函数:危化品企业列表----
	var whpEntList = function(data, textStatus){
		var pois = data.pois;
		var $poisContainer = $(".baiduMap-pois");
		//<a href="#"><span class="user-status is-busy"></span> <em>Herman S. Foltz</em></a>
		for(var i = 0 ; i<data.size ; i++){
			var aEle = $("<a href='#'><span class='user-status is-online'></span> <em>"+pois[i].title+"</em></a>");
			$poisContainer.append(aEle);
		};
		var totalPages = $("<span class='user-status is-online'></span> <em>共"+data.total+"条</em>");
		document.getElementById("entNum").innerHTML = data.total;
		$poisContainer.append(totalPages);
	}
	//=======END==ajax异步请求百度云数据平台的企业poi信息========
	
	//=======Start====分页=========================
	var getJSONData = function (data) {
		var totalCount = data.total; // 总记录数
		var pageSize = 10; // 每页显示几条记录  
		var pageTotal = Math.ceil(totalCount / pageSize); // 总页数  
		var startPage = pageSize * (pn - 1);  
		var endPage = startPage + pageSize - 1;
		var pois = data.pois;
		var $poisContainer = $(".baiduMap-pois");
		$poisContainer.empty();
		for(var i = 0 ; i<data.size ; i++){
			var aEle = $("<a href='#'><span class='user-status is-online'></span><em>"+pois[i].title+"</em></a>");
			$poisContainer.append(aEle);
		};
		document.getElementById("entNum").innerHTML = data.total;
		$(".total-page").text("共"+pageTotal+"页");
	}
    
	//data参照百度LBS响应参数json格式
	var pagination = function (data){
		var totalCount = data.total; // 总记录数
		var pageSize = 10; // 每页显示几条记录
		var pageTotal = Math.ceil(totalCount / pageSize); // 总页数
		$("#next").click(function() {
			if (pn == pageTotal) {
				//alert("后面没有了");
				$("#next").attr("class","disabled");
				pn = pageTotal;
			} else {
				pn++;
				$("#next").attr("class","none");
				gotoPage(pn);
			}
		});
		$("#prev").click(function(){
			if (pn == 1) {
				alert("前面没有了");
				pn = 1;
			} else {
				pn--; 
				gotoPage(pn);  
			}  
		})  
		$("#firstPage").click(function() {  
					pn = 1;  
					gotoPage(pn);  
				});  
		$("#lastPage").click(function() {  
					pn = pageTotal;  
					gotoPage(pn);  
				});  
		$("#page-jump").change(function(){  
			if($("#page-jump").val()  <= pageTotal &&$("#page-jump").val() > 0 && $("#page-jump").val() != ''){  
				pn = $("#page-jump").val();  
				gotoPage(pn);  
			}else{  
				alert("您输入的页码有误！");  
				$("#page-jump").val(pn).focus();  
			}  
		})  
		$("#firstPage").trigger("click");
	}
    function gotoPage(pn) {
        $("#page-jump").val(pn);
        getEnterpriseList("48047", getJSONData,pn);
    }
	//=======End====分页=========================
	
		$(document).ready(function(){
			initMap();
			getEnterpriseList("48047", pagination);
		});
	</script>
</body>
</html>
